<template>
  <div style="width: 100%; height: 240px;">
    <p-echarts :option="option" width="1000px" height="240px"/>
  </div>
</template>

<script>
import PEcharts from '@/components/charts/pEcharts'
import { postHandle } from '@/api'
export default {
  name: 'HjLineBig',
  components: { PEcharts },
  props: {
    geteWayCode: {
      type: String
    },
    obj: {
      type: Object
    },
    types: {
      type: Array
    }
  },
  data() {
    return {
      date: [],
      data1: [],
      data2: [],
      data3: [],
      data4: [],
      data5: [],
      data6: [],
      len: 0
    }
  },
  computed: {
    option() {
      let series = []
      // if (this.types.indexOf('current') !== -1) {
      series.push({
        name: '电流',
        data: this.data1,
        type: 'line',
        lineStyle: {
          color: '#5CD5C8'
        },
        // smooth:true,    //拐弯处变锋利
        symbol: 'none', // 去除圆角
        sampling: 'average',
        animationDurationUpdate: 3000
      })
      //   }
      //  if (this.types.indexOf('voltage') !== -1) {
      series.push({
        name: '电压',
        data: this.data2,
        type: 'line',
        lineStyle: {
          color: '#A48AEA'
        },
        // smooth:true,    //拐弯处变锋利
        symbol: 'none', // 去除圆角
        sampling: 'average',
        animationDurationUpdate: 3000
      })
      //  }
      //   if (this.types.indexOf('ss_speed') !== -1) {
      series.push(
        {
          name: '送丝速度',
          data: this.data3,
          type: 'line',
          lineStyle: {
            color: '#EAD18A'
          },
          // smooth:true,    //拐弯处变锋利
          symbol: 'none', // 去除圆角
          sampling: 'average',
          animationDurationUpdate: 3000
        })
      //   }
      //    if (this.types.indexOf('haz_temp') !== -1) {
      series.push({
        name: '热影响区温度',
        data: this.data4,
        type: 'line',
        lineStyle: {
          color: '#E07C71'
        },
        // smooth:true,    //拐弯处变锋利
        symbol: 'none', // 去除圆角
        sampling: 'average',
        animationDurationUpdate: 3000
      })
      //  }
      //  if (this.types.indexOf('air_flux') !== -1) {
      series.push({
        name: '气流量',
        data: this.data5,
        type: 'line',
        // smooth:true,    //拐弯处变锋利
        symbol: 'none', // 去除圆角
        sampling: 'average',
        animationDurationUpdate: 3000
      })
      //  }
      //  if (this.types.indexOf('ar_purity') !== -1) {
      series.push({
        name: '氩气纯度',
        data: this.data6,
        type: 'line',
        // smooth:true,    //拐弯处变锋利
        symbol: 'none', // 去除圆角
        sampling: 'average',
        animationDurationUpdate: 3000
      })
      //   }
      return {
        legend: {
          data: ['电流', '电压', '送丝速度', '热影响区温度', '气流量', '氩气纯度'],
          textStyle: {
            color: '#ffffff'
          }
          // selected: {
          //   '电流': this.types.indexOf('current') !== -1,
          //   '电压': this.types.indexOf('voltage') !== -1,
          //   '送丝速度': this.types.indexOf('ss_speed') !== -1,
          //   '热影响区温度': this.types.indexOf('haz_temp') !== -1,
          //   '气流量': this.types.indexOf('air_flux') !== -1,
          //   '氩气纯度': this.types.indexOf('ar_purity') !== -1
          // }
        },
        grid: {
          left: 30,
          right: 20,
          bottom: 30,
          top: 40
        },
        xAxis: {
          type: 'category',
          axisTick: {
            show: false
          },
          axisLabel: {
            show: false
          },
          data: this.date
        },
        color: ['#5CD5C8', '#A48AEA', '#EAD18A', '#E07C71', '#8ED55C', '#D12A89'],
        yAxis: {
          splitLine: {
            lineStyle: {
              type: 'dashed',
              color: '#C2C2C2'
            }
          },
          axisLine: {
            show: false
          },
          axisTick: {
            show: false
          },
          axisLabel: {
            show: true,
            color: '#FFFFFF'
          },
          type: 'value'
        },
        series: series
      }
    }
  },
  watch: {
    // geteWayCode(val) {
    //   if (val) {
    //     this.getData(val)
    //   }
    // },
    obj(val) {
      if (this.date.length > 60) {
        this.date.shift()
        this.data1.shift()
        this.data2.shift()
        this.data3.shift()
        this.data4.shift()
        this.data5.shift()
        this.data6.shift()
      }
      this.date.push(val['cj_time'])
      this.data1.push(val.current)
      this.data2.push(val.voltage)
      this.data3.push(val['ss_speed'])
      this.data4.push(val['haz_temp'])
      this.data5.push(val['air_flux'])
      this.data6.push(val['ar_purit'])
    }
  },
  mounted() {
    // if (this.geteWayCode) {
    //   this.getData(this.geteWayCode)
    // }
  },
  methods: {
    // getData(geteWayCode) {
    //   postHandle('/ekjdTest/api/HistoryData', { 'geteWay_code': geteWayCode }).then(res => {
    //     let data = res.result
    //     this.date = []
    //     this.data1 = []
    //     this.data2 = []
    //     this.data3 = []
    //     this.data4 = []
    //     this.data5 = []
    //     this.data6 = []
    //     this.len = data.length
    //     data.forEach((item, index) => {
    //       this.date.push(index)
    //       this.data1.push(item.current)
    //       this.data2.push(item.voltage)
    //       this.data3.push(item['ss_speed'])
    //       this.data4.push(item['haz_temp'])
    //       this.data5.push(item['air_flux'])
    //       this.data6.push(item['ar_purit'])
    //     })
    //   })
    // }
  }
}
</script>

<style scoped>

</style>
